<template>
  <div id="maind">
    <div v-if="dat">
      <a-table :columns="columns" :data="dat">
        <template #optional="{ record }">
          <a-popconfirm
            content="确定删除这条数据吗？"
            @ok="handelOk(record.objectId)"
          >
            <a-button type="primary" status="danger">删除</a-button>
          </a-popconfirm>
        </template>
      </a-table>
    </div>
  </div>
</template>

<script setup lang="ts">
import { reactive, ref } from "vue";
import {
  postMaintainPerson,
  delMaintainPerson,
} from "../../api/equipment/maintenanceInfo";
import { Message } from "@arco-design/web-vue";

let dat = ref([]);
postMaintainPerson().then((res) => {
  dat.value = res.data.results;
  console.log(dat.value);
});
let handelOk = (id: string) => {
  delMaintainPerson(id).then((res) => {
    postMaintainPerson().then((res) => {
      dat.value = res.data.results;
      Message.success("删除成功");
    });
  });
};

const columns = [
  {
    title: "事件来源",
    dataIndex: "source",
  },
  {
    title: "事件时间",
    dataIndex: "maintainTime",
  },
  {
    title: "事件地址",
    dataIndex: "address",
  },
  {
    title: "设备名称",
    dataIndex: "name",
  },
  {
    title: "设备编号",
    dataIndex: "sSerialNumber",
  },
  {
    title: "操作",
    slotName: "optional",
  },
];
</script>

<style scoped>
#maind {
  height: 100%;
  margin-top: 90px;
}
</style>
